<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>有奖答题平台</title>
	<!-- ICON -->
	<link href="/frame/images/meatball.ico" type="image/ico" rel="shortcut icon">
	<!-- CSS -->
	<link rel="stylesheet" href="/lib/layuiadmin/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/lib/layuiadmin/css/admin.css" media="all">
</head>
<body layadmin-themealias="default">
<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-card-body">
			<div class="layui-row">
				<div class="layui-col-md11">
					<form class="layui-form" id="queryForm" style="float: right;">
						<div class="layui-inline">
							<input type="text" name="account" title="账号" placeholder="请输入账号" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-inline">
							<input type="text" name="name" title="姓名" placeholder="请输入姓名" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-input-inline">
							<select name="sex" title="性别">
								<option value="-1"l>请选择性别</option>
								<option value="0">保密</option>
								<option value="1">男</option>
								<option value="2">女</option>
							</select>
						</div>
						<div class="layui-inline">
							<input type="text" name="email" title="邮件" placeholder="请输入邮件" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-inline">
							<input type="text" name="phone" title="电话" placeholder="请输入联系方式" autocomplete="off" class="layui-input">
						</div>
						<button class="layui-btn" lay-submit lay-filter="query">
							<i class="layui-icon">&#xe615;</i> 查询
						</button>
					</form>
				</div>
			</div>
			<hr class="layui-bg-gray">
			<div class="layui-row">
				<div class="layui-col-md12">
					<!-- 表格 -->
					<table id="table" lay-filter="table"></table>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- 操作 -->
<script type="text/html" id="operationBar">
<!--  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>-->
  <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="select_user">选择</a>
</script>

<!-- 详情 -->
<script type="text/html" id="view">
<table class="layui-table" style="width: 680px; margin: 10px 10px 0px 10px;">
	<tr>
		<td rowspan="5">
			{{# if(d.avatar) { }}
			<img class="layui-user-head-img" src="{{d.avatar}}">
			{{# }else{ }}
			<img class="layui-user-head-img" src="/frame/images/head_null.jpg">
			{{# } }}
		</td>
	</tr>
	<tr>
		<td class="table-td-title">账号</td>
		<td width="465">{{d.account}}</td>
	</tr>
	<tr>
		<td class="table-td-title">姓名</td>
		<td width="465">{{d.name}}</td>
	</tr>
	<tr>
		<td class="table-td-title">性别</td>
		<td width="465">{{d.sexName}}</td>
	</tr>
	<tr>
		<td class="table-td-title">生日</td>
		<td width="465">{{d.birthdayText}}</td>
	</tr>
</table>
<table class="layui-table" style="width: 680px; margin: 5px 10px 10px 10px;">
	<tr>
		<td class="table-td-title">角色</td>
		<td colspan="3">
			{{# for(var i = 0; i < d.rolesVo.length; i++) { }}
				{{d.rolesVo[i].roleName + (i < d.rolesVo.length - 1 ? '，' : '')}}
			{{# } }}
		</td>
	</tr>
	<tr>
		<td class="table-td-title">部门</td>
		<td colspan="3">
			{{d.deptText}}
		</td>
	</tr>
	<tr>
		<td class="table-td-title">邮箱</td>
		<td width="265">{{d.email}}</td>
		<td class="table-td-title">联系方式</td>
		<td width="265">{{d.phone}}</td>
	</tr>
	<tr>
		<td class="table-td-title">所属部门</td>
		<td width="265">{{d.roleid == null ? '无' : d.roleid}}</td>
		<td class="table-td-title">状态</td>
		<td width="265">{{d.statusName}}</td>
	</tr>
	<tr>
		<td class="table-td-title">拥有角色</td>
		<td width="265">{{d.deptid == null ? '无' : d.deptid}}</td>
		<td class="table-td-title">创建时间</td>
		<td width="265">{{d.createtimeText}}</td>
	</tr>
</table>
<br>
</script>

<script th:inline="javascript">
	var user_flag = [[${user_flag}]];
</script>

<!-- JavaScript -->
<script type="text/javascript" src="/lib/layuiadmin/layui/layui.js"></script>
<!-- javascirpt -->
<script type="text/javascript" th:inline="none">
layui.config({
	base: '/lib/layuiadmin/' //静态资源所在路径
}).extend({
	index: 'lib/index' //主入口模块
}).use(['index'], function() {
	var table = layui.table,
		form = layui.form,
		laydate = layui.laydate,
		element = layui.element,
		laytpl = layui.laytpl,
		$ = layui.jquery,
		$queryForm = $('#queryForm'),
		layerIndex = 1;

	// 绘制表格
	table.render({
// 		id: 'table',
		elem: '#table',
		url: '/pig/order/selectuser/table',
		page: true, // 开始分页
		// cellMinWidth: 80, // 定义全局最小宽度
		request: {
			pageName: 'offset'
		},
		response: {
            statusCode: 10000
          // countName: 'total', //数据总数的字段名称，默认：count
          // dataName: 'list' //数据列表的字段名称，默认：data
		},
		cols: [[
			{type: 'numbers', title: '序号'},
			{field:'account', title: '账号', sort: true},
			{field:'name', title: '姓名'},
            {field:'deptname', title: '部门'},
			{field:'sexName', title: '性别'},
			{field:'email', title: '邮件'},
			{field:'phone', title: '电话'},
			{field:'createtimeText', title: '创建时间'},
			// {field:'status', title: '状态', align:'center', templet: '#status'},
			{fixed: 'right', align:'center', width: 150, toolbar: '#operationBar'}
		]]
	});

	//监听工具条
	table.on('tool(table)', function(obj) {
		var data = obj.data,
			$this = $(this),
			getView = view.innerHTML;
		if(obj.event === 'select_user') {
			let a=parent.ChooseValues(user_flag,data);//注意这里调用父层的JS 实现传值
			var index= parent.layer.getFrameIndex(window.name);//获取当前层
			parent.layer.close(index);//关闭当前层
			return false;
		}
	});

	// 监听状态改变
	form.on('switch(switchSysUser)', function(obj) {
		operate('PUT', {'id': this.id, 'statusType': obj.elem.checked}, false);
	});

	// 搜索条件提示
	$queryForm.find('input').on('mouseover', function() {
		if(typeof($(this).attr('title')) == 'undefined') return;
		layer.tips($(this).attr('title'), this, {tips: 1});
	})

	// 查询用户
	form.on('submit(query)', function(data) {
		table.reload('table', {
			where: data.field
		});
		return false;
	})

	// 用户操作
	// ajaxType 请求类型
	// data 参数
	// refresh 是否刷新
	// 删除操作时传入的当前行对象
	function operate(ajaxType, data, refresh, delRow) {
		var url = '/pig/order/';
		$.ajax({
			url: url,
		    type: ajaxType,
		    async: true,
		    data: data,
		    success: function(res) {
		    	if(res.code == 10000) {
					layer.close(layerIndex);
					if(refresh) {
		    			table.reload('table');
					} else if(ajaxType == 'DELETE') {
						delRow.del();
					}
		    		if(data.resetPwd) {
		    			layer.alert(res.message, {icon: 6});
		    		} else {
						layer.msg(res.message, {icon: 1});
		    		}
		    	}  else if(res.code == 403) {
		    		layer.msg(res.message, {icon: 4});
		    	} else {
		    		layer.msg(res.message, {icon: 5});
		    	}
		    }
		})
	}

	//渲染弹框
	function popupWin(title, content, showBtn) {
		layerIndex = layer.open({
			id: 'meatball',
			type: 1, //Page层类型
			area: '700px', //['700px', '480'],
			maxWidth: 1000,
			maxHeight: 800,
			title: title,
            skin: 'layui-layer-rim', //加上边框
			shade: 0.1, //遮罩透明度
			// maxmin: true, //允许全屏最小化
			anim: 0, //0-6的动画形式，-1不开启
			scrollbar: false, //禁用滚动
			content: content,
			btn: showBtn ? ['<i class="layui-icon layui-icon-ok"></i> 提交', '<i class="layui-icon layui-icon-refresh-1"></i> 重置'] : '',
			yes: function(index, layero) {
				layero.find('form .submit').trigger('click');
				return false;
			},
			btn2: function(index, layero) {
				layero.find('form .reset').trigger('click');
				return false;
			}
		});
        // layer.full(layerIndex);
	}


	// 动态渲染控件
	function rendering() {
		var $form = $('form');
		// 渲染select
		form.render('select');
		// 重新渲染多选框
		form.render('checkbox');
		// 初始化日期
		laydate.render({
			elem: '.birthday'
		});

	}
});
</script>
</body>
</html>